import React, { useEffect, useState } from 'react';
import { Form, Input, Col, Button, message } from 'antd'
import { useNavigate } from 'react-router-dom'
import './ResetPass.scss'
import { getData, updPassword } from '../../../api/Workbench'
interface Props {

}
function ResetPass(props: Props) {
    // 调用Form的钩子函数useForm()
    const [form] = Form.useForm()
    const [messageApi, contextHolder] = message.useMessage()
    var [doctorPass, setDoctorPass] = useState('')
    var [doctorTel, setDoctorTel] = useState('')
    const navigate = useNavigate()
    useEffect(() => {
        getData({ doctorId: localStorage.getItem('doctorId') }).then((res: any) => {
            console.log(res, '25');
            var doctorTel = res.data.data[0].doctorTel
            var doctorPass = res.data.data[0].doctorPassword
            setDoctorTel(doctorTel)
            setDoctorPass(doctorPass)
        })
    }, [])
    // 提交表单
    const onFinish = (values: any) => {
        if (values.oldpass == undefined || values.newpass == undefined || values.enterpass == undefined) {
            messageApi.open({
                type: 'warning',
                content: '您还没有设置密码',
            });
        }
        else if (values.oldpass != '' && values.oldpass != doctorPass) {
            messageApi.open({
                type: 'error',
                content: '密码不正确',
            });
        } else if (values.newpass == doctorPass) {
            messageApi.open({
                type: 'warning',
                content: '与旧密码不可一致',
            });
        }
        else if (values.newpass != values.enterpass) {
            messageApi.open({
                type: 'warning',
                content: '两次密码输入必须一致',
            });
        } else {
            updPassword({ doctorTel: doctorTel, doctorPassword: doctorPass, password: values.newpass }).then((res: any) => {
                console.log(res, '1111');
                if (res.data.code == 200) {
                    messageApi.open({
                        type: 'success',
                        content: '保存成功,请重新登陆',
                    });
                    setTimeout(() => {
                        localStorage.removeItem("token")
                        navigate('/login')
                    }, 2000)
                }

            })
        }
    };
    // 提交失败
    const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
    };
    const layout = {
        labelCol: { span: 8 },
        wrapperCol: { span: 16 },
    };

    return (
        <div className='resetpass'>
            <div className="title">
                <div className='leftborder'></div>
                <h3>重置密码</h3>
            </div>
            <Form
                {...layout}
                form={form}
                layout="inline"
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}>
                <Col span={24}>
                    <Form.Item
                        label="旧密码"
                        name="oldpass"
                        rules={[{ message: '请输入' }]}
                    >
                        <Input.Password />
                    </Form.Item>
                </Col>
                <Col span={24}>
                    <Form.Item
                        label="新密码"
                        name="newpass"
                        rules={[{ required: true, message: "请输入新密码" },
                        ({ getFieldValue }) => ({
                            validator(_, value) {
                                if (!value || getFieldValue('oldpass') !== value) {
                                    return Promise.resolve();
                                }
                                return Promise.reject(new Error("两次密码输入一致,请重新输入"));
                            },
                        })
                        ]}
                    >
                        <Input.Password />
                    </Form.Item>
                </Col>
                <Col span={24}>
                    <Form.Item
                        label="确认密码"
                        name="enterpass"
                        rules={[{ required: true, message: "请确认新密码" },
                        ({ getFieldValue }) => ({
                            validator(_, value) {
                                if (!value || getFieldValue('newpass') === value) {
                                    return Promise.resolve();
                                }
                                return Promise.reject(new Error("两次密码输入不一致"));
                            },
                        })
                        ]}
                    >
                        <Input.Password />
                    </Form.Item>
                </Col>

                <Col span={24}>
                    <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                        <Button type="primary" htmlType="submit">
                            保存
                        </Button>
                    </Form.Item>
                </Col>
            </Form>
            {contextHolder}
        </div>
    );
}

export default ResetPass;